cc-pocket 1.4 · IA refresh — new & changed sections
Page theme
SCREEN A Landing · feature vignette 03 — “See what changed” same alternating rhythm as the four-jobs section · diff colors carry the interest
Desktop · ~1120px content column
03

See what changed看清每一处改动

Line-level diffs with per-language highlighting, right on your phone. Text is selectable, you can preview or export the patch, and tapping a path opens the file.手机上直接看行级 diff,按语言高亮。文本可选中,补丁可预览或导出,点路径即打开文件。

+42 −7
Files changed 2 files · +73 −16
~/proj/app/cc-pocket · ⑂ main
A
useReconnect.kt
src/net
+42
M
WsClient.kt
src/net/relay
+31 −9
kotlin·WsClient.kt@@ −12,4 +12,6 @@
12fun reconnect() {
13 scope.launch { open() }
13+ appScope.launch {
14+ delay(backoff); open("relay")
15+ } // survives cancel
16}
390px mobile
03

See what changed看清每一处改动

Line-level diffs, per-language highlighting, selectable text, preview / export, tap a path to open.行级 diff、按语言高亮、可选中、可预览导出,点路径即打开。

+42 −7
Files changed +73 −16
~/proj/app/cc-pocket · ⑂ main
A
useReconnect.kt
src/net
+42
M
WsClient.kt
src/net/relay
+31 −9
kotlin·WsClient.kt@@ −12,4 +12,6 @@
12fun reconnect() {
13 scope.launch { open() }
13+ appScope.launch {
14+ delay(backoff); open("relay")
15+ } // survives cancel
16}
Screen A notes
  • Terracotta appears twice only — the vignette number 03 and the chip dot. The diff’s + success green and danger red carry the interest.
  • Row grammar reused from the Changed Files v2 board — letter badges (A added · M modified) in hairline chips, mono filenames, right-aligned +N −M.
  • Hunk panel — full-width line tints, no horizontal scroller, text stays selectable; deletion on faint danger tint, addition on faint success tint.
SCREEN B Landing · feature vignette 04 — “It finds you — and loses nothing” replaces the old “watch it think” vignette · reliability is the story · flipped rhythm
Desktop · ~1120px content column
04

It finds you — and loses nothing它会找到你——且不丢一个字

A push notification lands the moment a turn finishes. If the connection blips mid-stream, the missed output is backfilled on reconnect — the transcript is always complete.一轮回答刚结束,推送就到。若中途断线,重连后自动补齐漏掉的输出——记录永远完整。

reconnected · backfilled
CC Pocket
Claude finished · Fix relay reconnect
now
Fix relay reconnect default
Lidapeng-MacBook · ~/proj/app/cc-pocket
The reconnect loop dies after the 3rd retry — the scope owning the timer is cancelled when the socket closes.
reconnected — output backfilled
I hoisted the backoff timer to an app-level scope, so it survives the socket closing. Re-running the relay suite now.
Bashgradle :relay:test
390px mobile
04

It finds you — and loses nothing它会找到你——且不丢一个字

A push lands when a turn finishes; if the connection blips, missed output is backfilled on reconnect.回答结束即推送;若断线,重连后补齐漏掉的输出。

reconnected · backfilled
CC Pocket
Claude finished · Fix relay reconnect
now
Fix relay reconnect default
Lidapeng-MacBook · ~/proj/app/cc-pocket
The reconnect loop dies after the 3rd retry — the scope owning the timer is cancelled when the socket closes.
reconnected — output backfilled
I hoisted the backoff timer to an app-level scope, so it survives the socket closing.
Bashgradle :relay:test
Screen B notes
  • Single terracotta focal — the streaming caret. The push banner and the backfill divider stay neutral (surface + hairline + muted mono).
  • Push banner overlays the top edge: app-icon glyph, CC Pocket, then Claude finished · Fix relay reconnect.
  • Backfill divider — a full-width chip mid-stream reading reconnected — output backfilled in 10px mono, hairline rule left and right, between two assistant paragraphs.
SCREEN C Landing · “More capabilities” grid refresh 3×3, conversion-vetted order · shown in both page themes · mobile = single column
Page theme · dark

More capabilities更多能力

And a lot more in your pocket.口袋里,还有很多。

Page theme · light

More capabilities更多能力

And a lot more in your pocket.口袋里,还有很多。

390px mobile · single column

More capabilities更多能力

And a lot more in your pocket.口袋里,还有很多。

…5 more, stacked

Card anatomy (as shipped) · new icons in the 1.5pt stroke family
  • Anatomy unchanged — 26px line icon in terracotta, 16px semibold title, 13.5px secondary copy, surface + hairline, radius 16.
  • Order (1→9) — Usage insights · Control & permissions · Agents & workflows · Ways to talk to it · Watch it think live · Fleet overview · Share a folder · Sessions & groups · Private by design.
  • New iconsUsage insights (bar chart) · Agents & workflows (stacked layers) · Fleet overview (two machines + status dot) · Share a folder (folder + guest) · Watch it think live (stream / pulse line).
SCREEN D Features page · three new group treatments page-themed (dark) · matches the existing .fgroup rhythm
D1

“Usage insights” group

Section head + a 3-up card row, plus one compact usage visual strip matching the shipped app — hourly bars beside a 30-day heatmap.

Usage insights用量洞察

Know what your agent costs.清楚知道你的 agent 花了多少。

Tokens & estimated cost

Every session totals its tokens and shows a running dollar estimate — no surprises at the end of the day.

Today, hour by hour

A calm 24-bar strip of today’s usage. The busiest hour reads full terracotta; the rest sit quiet.

30-day heatmap

A month at a glance — a terracotta opacity ramp shows the heavy days without a single number.

Today · hour by hour
1.84M tokens · $4.20 est.
Last 30 days
D2

“Share a folder” group

Section head + a 4-up card row, plus the boundary card — a neutral two-column “they get / they don’t”. No terracotta badges; terracotta lives only in the card icons.

Share a folder共享一个文件夹

Lend an agent, not your laptop.借出一个 agent,而不是你的电脑。

Invite to one folder

Scope a guest to a single directory. Everything outside it stays invisible.

Three access levels

Read, propose, or run — pick how much rope the guest gets, per invite.

Expiry & revoke

Every share has a clock and a kill switch. Revoke and the link is dead instantly.

Honest boundaries

We tell guests exactly what they can and can’t reach — in plain words.

THEY GET
  • The one folder you shared — read, and edit if allowed.
  • A live agent that runs commands inside it.
  • Their own session history, separate from yours.
THEY DON’T GET
  • Any path outside the shared folder.
  • Your other projects, keys, or credentials.
  • A way to invite anyone else in.
The honest part: shell commands run as your user on your machine. We fence the working directory, not the operating system — so we say so, plainly, instead of promising isolation we can’t guarantee.
D3

“Workflow orchestration” visual (visibility group)

A compact phone frame showing the Workflow run view — stacked agent lanes + a phase progress bar. A supporting visual, not a hero.

See the whole swarm at once一眼看清整个 agent 群

When a workflow fans out across dozens of agents, the run view keeps it legible: phases as a segmented bar, agents as stacked lanes, one live pulse for what’s working now.当一个工作流散开成几十个 agent,运行视图仍然清晰:阶段是分段进度条,agent 是堆叠泳道,一个跳动的点标出此刻正在跑的部分。

Workflow run phase 2/4
~/proj/app/cc-pocket · release-pipeline
release-pipeline 3m 12s
phase 2/4 · analyze·12/34 agents
discover
analyze
patch
verify
one glance across 34 parallel agents一眼看遍 34 个并行 agent
D4

“Desktop & fleet” group header

The phrasing is the design — both language variants shown stacked. Existing desktop-window + fleet-card reuse sits underneath (from the 1.3 board).

Desktop & fleet桌面与机群

The phone triages. The desktop commands.

手机分诊,桌面指挥。

Both variants ship — the site picks one by language; the phrasing carries the division of labor either way.

Reuse beneath the header
  • The desktop window mockup and floating fleet card ship unchanged from the 1.3 Desktop + Fleet board — this group only re-heads them.
  • Device chrome stays dark; the header itself is page-themed and follows the site’s light / dark toggle.